<template>
	<view>
		<view class="d-flex j-center a-center">
			<view class="head-text" @tap="$refs.openAlertmodify.Show()">修改商家信息</view>
		</view>

		<openAlert BgColor="rgba(0,0,0,0.8)" ref="openAlertmodify" :AlertClass="0" :AlertPosition="'center'"
		 closeBtn>

			<view class="modify">
				<view class="modify-title">修改商家信息</view>

				<view  class="scrollview">
					<!-- <scroll-view scroll-y="true" :style="'height:'+scrollH+'px;'"> -->
					<view class="modify-info">
						<view>商家名称:
							<input :placeholder="factory_info_data.name" type="text" class="modify-input" v-model="modify.name" /></view>
						<view>联系方式:
							<input :placeholder="factory_info_data.tel" type="number" maxlength="11" class="modify-input" v-model="modify.phone" /></view>
						<view>修改商家地址:
							<input :placeholder="factory_info_data.address" type="text" class="modify-input" v-model="modify.address" /></view>
						<!-- <view>老板姓名:
							<input :placeholder="factory_info_data.boss_name" type="text" class="modify-input" v-model="modify.boss_name" /></view>
						<view>老板电话:
							<input :placeholder="factory_info_data.boss_tel" type="number" maxlength="11" class="modify-input" v-model="modify.boss_tel" /></view> -->

						<view class="signimg">
							<view>修改头像:</view>
							<image @click="uploadImg('head_url')" :src="modify.head_url ? modify.head_url : '../../static/up-img.png'" 
							 :class="modify.head_url ? 'br' : 'img'"></image>
							<!-- <image :src="modify.head_url" class="ml-3 br"></image> -->
						</view>
						<divider  />

						<view class="signimg">
							<view>修改二维码:</view>
							<image @click="uploadImg('code_url')" :src="modify.code_url ? modify.code_url : '../../static/up-img.png'" 
							 :class="modify.code_url ? 'br' : 'img'"></image>
							<!-- <image :src="modify.code_url" class="ml-3 br"></image> -->
						</view>

						<view><button @click="queren()" class="modify-but">确&nbsp;&nbsp;&nbsp;&nbsp;认</button></view>
						<view><button class="mb-3" @click="$refs.openAlertmodify.Close()">取&nbsp;&nbsp;&nbsp;&nbsp;消</button></view>
					</view>
				<!-- </scroll-view> -->
				</view>
			</view>
		</openAlert>
	</view>
</template>

<script>
	export default {
		props: {
			factory_info_data: null,
			modify: null,
			scrollH: null,
			// CustomPosition: null,
			factory_id: null,
		},
		data() {
			return {
				// scrollH: 100,
				AlertClass: 0,
				AlertPosition: '',
			}
		},
		methods: {

			//确认修改工厂信息
			queren() {
				var id = this.factory_id
				// console.log(id,444)
				let data = this.modify
				if (data.name == '') {
					uni.showToast({
						title: '商家名称不能为空',
						icon: 'none'
					})
					return false;
				}
				if (data.phone == '') {
					uni.showToast({
						title: '商家联系方式不能为空',
						icon: 'none'
					})
					return false;
				} else {
					let myreg = /^[1][3,4,5,7,8,9][0-9]{9}$/;
					// let landlinePtn = /^(0[0-9]{2,3}\-)([2-9][0-9]{6,7})+(\-[0-9]{1,4})?$/;
					if (!myreg.test(data.phone)) {
						uni.showToast({
							title: '商家电话不合法',
							icon: 'none'
						});
						return false;
					}
				}
				if (data.address == '') {
					uni.showToast({
						title: '商家地址不能为空',
						icon: 'none'
					})
					return false;
				}
				this.$comm.request({
					url: 'api/factory_update',
					method: 'POST',
					data: {
						boss_name: data.boss_name,
						boss_tel: data.boss_tel,
						code_url: data.code_url,
						head_url: data.head_url,
						name: data.name,
						tel: data.phone,
						address: data.address,
						factory_id: id,
					},
					success: res => {
						var res = res.data
						if (res.code != 200) {
							uni.showToast({
								title: res.msg,
								icon: "none"
							});
							return
						}
						uni.showToast({
							title: res.msg,
						});
						this.$refs.openAlertmodify.Close();
						this.$emit('factory_info')
					},
				})
			},
			
			uploadImg(msg) {
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'],
					sourceType: ['album'],
					success: (res) => {
						// console.log(res, 6666)
						this.$comm.ossUpFile(res.tempFiles[0], (url) => {
							console.log(url, 6666)
							if (msg == 'code_url') {
								this.modify.code_url = url
							} else if (msg == 'head_url') {
								this.modify.head_url = url
							}
						});
					}
				})
			},
		},

	}
</script>

<style lang="scss" scoped>
	@import '@/common/main.css';
	@import  '@/common/zcm-main.css';
	
	page {}

	.head-text {
		color: #ffffff;
		line-height: 2.5;
		background-color: #475dfc;
		width: 300rpx;
		text-align: center;
		border-radius: 50rpx;
	}

	.modify {
		width: 650rpx;
		// height: 1100rpx;
		background: #fff;
		border-radius: 20rpx ;

		.modify-title {
			text-align: center;
			font-size: 45rpx;
			padding-top: 30rpx;
			margin-bottom: 10rpx;
		}
	}

	.scrollview {
		// height: 2000rpx;

		.modify-info {
			margin: 0 50rpx 0rpx 50rpx;
			display: flex;
			flex-direction: column;
			color: #000000;
			font-size: 30rpx;

			view {
				line-height: 1.5;
			}

			.modify-input {
				padding-left: 20rpx;
				background-color: rgba(0, 0, 0, 0.2);
				color: #000000;
				height: 70rpx;
				margin-top: 5rpx;
				margin-bottom: 20rpx;
				border-radius: 10rpx;
			}
		}
	}

	.signimg {
		display: flex;
		align-items: flex-end;
		// margin-top: 20rpx;
		margin-bottom: 10rpx;
		font-size: 30rpx;

		view {
			width: 30%;
		}

		image {
			width: 100rpx;
			height: 100rpx;
		}

		.img {
			padding: 28rpx;
			border: solid 5rpx #EDEDED;
			border-radius: 5rpx;
		}
	}

	.modify-but {
		margin-top: 20rpx;
		margin-bottom: 20rpx;
		background-color: #475dfc;
		color: #ffffff;
	}
</style>
